<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="style.css">
    <style>
        .td-p {
            width: 100%;
            justify-content: flex-start;
        }
        .a_tag{
            color: #479eff;
        }
    </style>
</head>
<body>
<div class="progress-container">
    <div class="project-name">
        <h1 th:text="${proName}">南昌临空经济区(赣江新区临空组团)项目办理事项时间节点计划表（入驻标准厂房项目）</h1>
    </div>
    <!--<div class="project-info flex">
        <div class="flex">
            <span>企业名称：</span>
            <span th:text="${companyName}">江西国盛富建设工程公司</span>
        </div>
        <div class="flex">
            <span>项目名称：</span>
            <span th:text="${proName}">南昌临空经济区(赣江新区临空组团)项目</span>
        </div>
    </div>-->
    <div class="project-about">
        <div class="project-info">
            <span class="about-title">企业名称：</span>
            <span th:text="${companyName}">江西国盛富建设工程公司</span>
        </div>
        <div class="project-info">
            <div class="about-title">项目简介：</div>
            <!--<div class="about-title">
                项目简介
            </div>-->
            <div class="about-text" th:text="${remark}"></div>
        </div>
    </div>
    <div class="project_content_box">
        <div class="project-type flex">
            <div class="type-item flex">
                图例:
            </div>
            <div class="type-item flex">
                <img src="img/light_01.png" alt="">
                <span style="color: #807d78">未亮灯</span>
            </div>
            <div class="type-item flex">
                <img src="img/light_02.png" alt="">
                <span style="color: #d81e06">亮红灯</span>
            </div>
            <div class="type-item flex">
                <img src="img/light_03.png" alt="">
                <span style="color: #ffc822">亮黄灯</span>
            </div>
            <div class="type-item flex">
                <img src="img/light_04.png" alt="">
                <span style="color: #009245">正常完成</span>
            </div>
        </div>
        <div class="progress-box">
            <!-- <div class="box-bg"></div> -->
            <div class="box-content flex" id="matter-content">
                <!-- 项目抄告 -->
                <!--<div class="progress-item item1">-->
                    <!--&lt;!&ndash; 标题 &ndash;&gt;-->
                    <!--<div class="item-th">项目抄告</div>-->
                    <!--&lt;!&ndash; 单个块内容 &ndash;&gt;-->
                    <!--<div class="item_content_box">-->
                        <!--<div class="item_table_box">-->
                            <!--<div class="item_table">-->
                                <!--建设工程规划许可-->
                            <!--</div>-->
                        <!--</div>-->
                        <!--<div class="item_time_box">-->
                            <!--<div class="item_time_line"></div>-->
                            <!--<div>2020-08-07</div>-->
                        <!--</div>-->
                        <!--<div class="item-td_box">-->
                            <!--<div class="item-td flex color-4 row-1">-->
                                <!--<p class="td-p flex">-->
                                    <!--<img src="img/light_04.png" alt="">-->
                                    <!--<span class="item_beyond">项目抄告单</span>-->
                                <!--</p>-->
                                <!--<div class="item_beyond">-->
                                    <!--办理部门: 企业-->
                                <!--</div>-->
                                <!--<div class="item_beyond">-->
                                    <!--计划完成时间: 2020年5月6日-->
                                <!--</div>-->
                                <!--<div class="item_complete item_jinxingz">进行中</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->

                <!--</div>-->
                <!--&lt;!&ndash; 项目立项 &ndash;&gt;-->
                <!--<div class="progress-item item1">-->
                    <!--<div class="item-th">项目立项</div>-->
                    <!--<div class="item_content_box">-->
                        <!--<div class="item_table_box">-->
                            <!--&lt;!&ndash;<div class="item_table">-->
                                <!--建设工程规划许可-->
                            <!--</div>&ndash;&gt;-->
                        <!--</div>-->
                        <!--<div class="item_time_box">-->
                            <!--<div class="item_time_line"></div>-->
                            <!--<div>2020-08-07</div>-->
                        <!--</div>-->
                        <!--<div class="item-td_box">-->
                            <!--<div class="item-td flex color-4 row-1">-->
                                <!--<p class="td-p flex">-->
                                    <!--<img src="img/light_04.png" alt="">-->
                                    <!--<span class="item_beyond">项目抄告单</span>-->
                                <!--</p>-->
                                <!--<div class="item_beyond">-->
                                    <!--办理部门: 企业-->
                                <!--</div>-->
                                <!--<div class="item_beyond">-->
                                    <!--计划完成时间: 2020年5月6日-->
                                <!--</div>-->
                                <!--<div class="item_complete item_wancheng">已完成</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</div>-->
                <!--<div class="progress-item item2">-->
                    <!--<div class="item-th">模拟审批</div>-->
                    <!--<div class="item_content_box">-->
                        <!--<div class="item_table_box">-->
                            <!--&lt;!&ndash;<div class="item_table">-->
                                <!--建设工程规划许可-->
                            <!--</div>&ndash;&gt;-->
                        <!--</div>-->
                        <!--<div class="item_time_box">-->
                            <!--<div class="item_time_line"></div>-->
                            <!--<div>2020-08-07</div>-->
                        <!--</div>-->
                        <!--<div class="item-td_box">-->
                            <!--<div class="item-td flex color-4 row-1">-->
                                <!--<p class="td-p flex">-->
                                    <!--<img src="img/light_04.png" alt="">-->
                                    <!--<span class="item_beyond">项目抄告单</span>-->
                                <!--</p>-->
                                <!--<div class="item_beyond">-->
                                    <!--办理部门: 企业-->
                                <!--</div>-->
                                <!--<div class="item_beyond">-->
                                    <!--计划完成时间: 2020年5月6日-->
                                <!--</div>-->
                                <!--&lt;!&ndash;<div class="item_complete item_wancheng">已完成</div>&ndash;&gt;-->
                                <!--<div class="item_complete item_weikaishi">未开始</div>-->
                                <!--&lt;!&ndash;<div class="item_complete item_jinxingz">进行中</div>&ndash;&gt;-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</div>-->
                <!--&lt;!&ndash; 项目供地 &ndash;&gt;-->
                <!--<div class="progress-item item2">-->
                    <!--<div class="item-th">项目供地</div>-->

                    <!--<div class="item_content_multiple">-->
                        <!--<div class="item_content_box">-->
                            <!--<div class="item_table_box">-->
                                <!--<div class="item_table">-->
                                    <!--建设工程规划许可-->
                                <!--</div>-->
                            <!--</div>-->
                            <!--<div class="item_time_box">-->
                                <!--<div class="item_time_line"></div>-->
                                <!--<div>2020-08-07</div>-->
                            <!--</div>-->
                            <!--<div class="item-td_box">-->
                                <!--<div class="item-td flex color-1 row-1">-->
                                    <!--<p class="td-p flex">-->
                                        <!--<img src="img/light_04.png" alt="">-->
                                        <!--<span class="item_beyond">项目抄告单</span>-->
                                    <!--</p>-->
                                    <!--<div class="item_beyond">-->
                                        <!--办理部门: 企业-->
                                    <!--</div>-->
                                    <!--<div class="item_beyond">-->
                                        <!--计划完成时间: 2020年5月6日-->
                                    <!--</div>-->
                                    <!--<div class="item_complete item_weikaishi">未开始</div>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->
                        <!--<div class="item_content_box">-->
                            <!--<div class="item_table_box">-->
                                <!--<div class="item_table">-->
                                    <!--建设工程规划许可-->
                                <!--</div>-->
                            <!--</div>-->
                            <!--<div class="item_time_box">-->
                                <!--<div class="item_time_line"></div>-->
                                <!--<div>2020-08-07</div>-->
                            <!--</div>-->
                            <!--<div class="item-td_box">-->
                                <!--<div class="item-td flex color-1 row-1">-->
                                    <!--<p class="td-p flex">-->
                                        <!--<img src="img/light_04.png" alt="">-->
                                        <!--<span class="item_beyond">项目抄告单</span>-->
                                    <!--</p>-->
                                    <!--<div class="item_beyond">-->
                                        <!--办理部门: 企业-->
                                    <!--</div>-->
                                    <!--<div class="item_beyond">-->
                                        <!--计划完成时间: 2020年5月6日-->
                                    <!--</div>-->
                                    <!--&lt;!&ndash;<div class="item_complete item_wancheng">已完成</div>&ndash;&gt;-->
                                    <!--<div class="item_complete item_weikaishi">未开始</div>-->
                                    <!--&lt;!&ndash;<div class="item_complete item_jinxingz">进行中</div>&ndash;&gt;-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</div>-->
                <!--&lt;!&ndash; 土地摘牌 &ndash;&gt;-->
                <!--<div class="progress-item item1">-->
                    <!--<div class="item-th">土地摘牌</div>-->
                    <!--<div class="item_content_box">-->
                        <!--<div class="item_table_box">-->
                            <!--&lt;!&ndash;<div class="item_table">-->
                                <!--建设工程规划许可-->
                            <!--</div>&ndash;&gt;-->
                        <!--</div>-->
                        <!--<div class="item_time_box">-->
                            <!--<div class="item_time_line"></div>-->
                            <!--<div>2020-08-07</div>-->
                        <!--</div>-->
                        <!--<div class="item-td_box">-->
                            <!--<div class="item-td flex color-4 row-1">-->
                                <!--<p class="td-p flex">-->
                                    <!--<img src="img/light_04.png" alt="">-->
                                    <!--<span class="item_beyond">项目抄告单</span>-->
                                <!--</p>-->
                                <!--<div class="item_beyond">-->
                                    <!--办理部门: 企业-->
                                <!--</div>-->
                                <!--<div class="item_beyond">-->
                                    <!--计划完成时间: 2020年5月6日-->
                                <!--</div>-->
                                <!--&lt;!&ndash;<div class="item_complete item_wancheng">已完成</div>&ndash;&gt;-->
                                <!--<div class="item_complete item_weikaishi">未开始</div>-->
                                <!--&lt;!&ndash;<div class="item_complete item_jinxingz">进行中</div>&ndash;&gt;-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</div>-->
            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var prefix = ctx + "linkong/project";
    var proId = [[${proId}]];
    var mydata = {};
    $(function () {
        $.ajax({
            url: prefix + "/selectMattersByIds2",
            type: 'POST',
            data: { proId: proId},
            async: false,
            success: function (data) {
                console.log(data)
                mydata = data;
            }
        })
        renderList();

    })

    function renderList(){
        var str = "";
        var index = 0;
        for (var obj in mydata){  // 遍历对象
                var item = mydata[obj]; // 获得对象
                var length = Object.keys(item).length; //获得长度
                str += '<div class="progress-item item2">'
                    +  '<div class="item-th">' + obj +'</div>';
                if(length > 1){ //有小类
                    str += '<div class="item_content_multiple">';
                    str += commonstr(item);
                    str += '</div></div>';
                }else{
                    str += commonstr(item);
                    str += '</div>';
                }
        }
        $("#matter-content").html(str);
    }

    function commonstr(_myobj){
        var str ="";
        for(var my_key in _myobj){
            var date_str = "";
               str += '<div class="item_content_box">'
                    + '<div class="item_table_box">';
            // 事项的类别名称
            if(my_key != '001'){
                str += '<div class="item_table">' + my_key + '</div>' ;
            }
            str += "</div>";
            // 开始遍历事项
            var myarr = _myobj[my_key];
            $.each(myarr, function (i, value) {
                var colorStr = "";
                var statusStr = "";
                var statusClass = "";
                var datestr = value.expectedDate
                if (value.status == '0') { // 未审核
                       colorStr = '1';
                       statusStr = "进行中";
                       statusClass = "jinxingz";
                    }
                if (value.status == '1' && (value.light == null || value.light == '')) {
                        colorStr = '4'; // 绿色
                        statusStr = "已完成";
                        statusClass = "wancheng";
                    }
                    if (value.light == '1') { // 红灯
                        colorStr = '2';
                    }
                    if (value.light == '2') { // 黄灯
                        colorStr = '3';
                    }
                    if(value.status == '2'){
                        statusStr = "已驳回";
                        statusClass = "weikaishi";
                    }
                if (date_str == ""){
                    date_str = datestr;
                    // 日期
                    str += dateStrFun(datestr);

                }else if (date_str == datestr){

                }else if (date_str != datestr){
                    date_str = datestr;
                    str += dateStrFun(datestr);
                }
                str += '<div class="item-td_box">'
                     + '<div class="item-td flex color-' + colorStr + ' row-'+ colorStr +'">';
                    if(colorStr == '3' || colorStr == '2'){
                        str += '<p class="td-p flex" style="cursor: pointer" onclick="preview(' + proId + ',' + value.id + ',' + value.light + ')">'
                            + '<img src="img/light_0'+colorStr+'.png" alt="">'
                            + '<span class="item_beyond a_tag" >' + value.name + '</span>'
                            + '</p>';
                    }else{
                        str += '<p class="td-p flex">'
                            + '<img src="img/light_0'+colorStr+'.png" alt="">'
                            + '<span class="item_beyond">' + value.name + '</span>'
                            + '</p>';
                    }
                     str += '<div class="item_beyond">办理部门: ' + value.mainOrgname + '</div>'
                     + '<div class="item_beyond">计划完成时间: ' + datestr + '</div>'
                     + '<div class="item_complete item_'+ statusClass + '">'+ statusStr +'</div>'
                     + '</div></div>';

            })
            str += '</div>';

        }
        return str;

    }

    function dateStrFun(datestr){
        var str = '<div class="item_time_box">'
            + '<div class="item_time_line"></div>'
            + '<div>' + datestr + '</div>'
            + '</div>';
        return str;
    }


    function preview(projectId, matterProjectId, lightTyep) {
        var url = 'linkong/notice/preview/?lkProjectId=' + projectId + '&lkMatterProjectId=' + matterProjectId + '&lightType=' + lightTyep;
        layer.open({
            type: 2,
            maxmin: true,
            shade: 0.3,
            title: "预览",
            fix: false,
            area: ['800px', ($(window).height() - 50) + 'px'],
            content: url,
            shadeClose: true,
            cancel: function () {
                return true;
            }
        })
    }
</script>
</body>


</html>